<template>
    <div class="p10 border flex_col mt5">
        <div class="flex_row_center">
            <label>休假日期:</label>
            <label>{{ ctx.info.date }} {{ TIMES[ctx.info.time] }}</label>
        </div>
        <div class="flex_row_center">
            <label>休假天数:</label>
            <label>{{ ctx.info.days }}</label>
        </div>
        <div class="flex_row_center mt5">
            <el-button @click="onClickdelete" type="warning">删除</el-button>
            <label class="ml5" v-if="ctx.info.version == 0">旧年假</label>
        </div>
    </div>
</template>

<script setup lang="ts">

import { service, type LeaveInfo } from '@/service/api';
import { runAction } from '@/utils/ui';
import { TIMES } from '@/service/global';

interface Ctx {
    info: LeaveInfo,
}

const ctx = defineProps<Ctx>();



async function onClickdelete() {
    runAction('删除', '', async () => {
        await service.deleteLeave({
            id: ctx.info.id
        });
    });
}

</script>
